<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<title>功能服务管理</title>
<link rel="stylesheet" th:href="@{/layui/css/layui.css}">
</head>
<body class="layui-layout-body">
	<div class="layui-layout layui-layout-admin">
		<div data-th-replace="~{layout :: header}"></div>
		<div class="layui-body" style="left: 10px;top:10px">
			<!-- 内容主体区域 -->
			<div>
				<form id="searchFrom" class="layui-form layui-form-pane"
					th:action="@{/functional/list}" method="post">
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-label">名称</label>
							<div class="layui-input-inline">
								<input name="name" placeholder="服务名称" class="layui-input"
									th:value="${name != null ? name : ''}" maxlength="30">
							</div>
						</div>
						<div class="layui-inline">
							<label class="layui-form-label">操作人</label>
							<div class="layui-input-inline">
								<input name="operator" placeholder="操作人" class="layui-input"
									th:value="${operator != null ? operator : ''}" maxlength="30">
							</div>
						</div>
						<div class="layui-inline">
							<label class="layui-form-label">状态</label>
							<div class="layui-input-inline">
								<select id="state" name="state">
									<option value="-1" th:selected="${state==-1}">全部状态</option>
									<option value="0" th:selected="${state==0}">已推荐</option>
									<option value="1" th:selected="${state==1}">未推荐</option>
								</select>
							</div>
						</div>
						<button type="submit" class="layui-btn">搜索</button>
						<a class="layui-btn" href="javascript:void(0)" onclick="add()">新增</a>
					</div>
				</form>
			</div>
			<table class="layui-table">
				<colgroup>
					<col width="100">
					<col width="100">
					<col>
				</colgroup>
				<thead>
					<tr>
						<th><b>顺序号</b></th>
						<th><b>默认</b></th>
						<th><b>名称</b></th>
						<th><b>图标</b></th>
						<th><b>跳转地址</b></th>
						<th><b>跳转类型</b></th>
						<th><b>所属分类</b></th>
						<th><b>支持系统</b></th>
						<th><b>排序</b></th>
						<th><b>状态</b></th>
						<th><b>操作人</b></th>
						<th><b>操作时间</b></th>
						<th><b>操作</b></th>
					</tr>
				</thead>
				<tbody>
					<tr data-th-each="item, iterStat : ${datas}">
						<td data-th-text="${iterStat.count}+${pageIndex-1}*${pageSize}"></td>
						<td>
							<div th:if="${item.isDef == 1}"
								class="layui-unselect layui-form-switch"
								th:onclick="'javascript:isDefState('+${item.id}+',0);'">
								<em>关</em><i></i>
							</div>
							<div th:if="${item.isDef == 0}"
								class="layui-unselect layui-form-switch layui-form-onswitch"
								th:onclick="'javascript:isDefState('+${item.id}+',1);'">
								<em>开</em><i></i>
							</div>
						</td>
						<td data-th-text="${item.name}"></td>
						<td><img th:src="${item.image}"
							style="width: 50px; height: 50px;" /></td>
						<!-- 状态类型，0表示超链接，1表示H5，2表示帖子，3表示门禁，4表示小组，5表示群聊 -->
						<td>
							<span th:if="${item.type == 0 || item.type == 1}">[[${item.url}]]</span>
						</td>
						<td><span th:if="${item.type == 0}">超链接</span> <span
							th:if="${item.type == 1}">H5</span> <span
							th:if="${item.type == 2}">原生话题贴</span> <span
							th:if="${item.type == 3}">门禁</span> <span
							th:if="${item.type == 4}">小组</span> <span
							th:if="${item.type == 5}">群聊</span></td>
						<td data-th-text="${item.categoryName}"></td>
						<td>
							<span th:if="${item.platform == 0}">全部</span> 
							<span th:if="${item.platform == 1}">IOS</span> 
							<span th:if="${item.platform == 2}">Android</span>
						</td>
						<td><span
							th:onclick="'javascript:showView(\'/functional/update_manager_sort?id=' + ${item.id} + '\',' + ${item.sort} + ');'">[[${item.sort}]]</span></td>
						<td><span th:if="${item.isRecommend == 0}">已推荐</span> <span
							th:if="${item.isRecommend == 1}">未推荐</span></td>
						<td data-th-text="${item.operator}"></td>
						<td data-th-text="${item.updateTime}" class="date"></td>
						<td><a class="layui-btn layui-btn-xs"
							th:onclick="'javascript:edit(' + ${item.id} + ');'">编辑</a> <a
							th:if="${item.isRecommend == 0}"
							class="layui-btn layui-btn-xs layui-btn-warm"
							th:onclick="'javascript:update(0,' + ${item.id} + ');'">取消推荐</a>
							
							<a th:if="${item.isRecommend == 1}" class="layui-btn layui-btn-xs"
							th:onclick="'javascript:update(1,' + ${item.id} + ');'">推荐</a>
							 
							<a th:if="${item.isRecommend == 1}" class="layui-btn layui-btn-xs layui-btn-warm"
							th:onclick="'javascript:update(2,' + ${item.id} + ');'">删除</a>
							
							<a class="layui-btn layui-btn-xs layui-btn-warm" th:if="${item.isRecommend == 0}"
							 style="color:rgb(204, 204, 204);background-color: #ffffff;">删除</a>
						</td>
					</tr>
				</tbody>
			</table>

			<div id="pageContent"></div>
		</div>

		<div class="layui-footer">
			<!-- 底部固定区域 -->

		</div>
	</div>
	<!-- <script src="/layui/jquery.min.js"></script>
<script src="/layui/layui.js"></script> -->
	<script th:inline="javascript">
//JavaScript代码区域
var contextRoot = /*[[@{/}]]*/ '';
layui.use('laypage', function(){
  var laypage = layui.laypage;
  //执行一个laypage实例
  laypage.render({
	  elem: 'pageContent'
	  ,count:[[${total}]] //数据总数，从服务端得到
	  ,curr: [[${pageIndex}]]	
	  ,layout:['count','prev', 'page', 'next','skip']
	  ,jump: function(obj, first){
		  console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
		  console.log(obj.limit); //得到每页显示的条数
	    //首次不执行
	   if(!first || [[${pageIndex}]] != obj.curr){
	      window.location.href = contextRoot+'/functional/list?pageIndex=' + obj.curr + "&pageSize=" + obj.limit +
	      "&" + $("#searchFrom").serialize();
	    } 
	  }
	}); 
});
function del(id){
	layer.confirm("你确定要删除该服分类吗？",function(index) {
		$.ajax({
			type : "POST",
			data : {'id':id},
			url : contextRoot+"/functional/del",
			dataType : "json",
			success : function(msg) {
				console.log(msg);
				if (msg.meta.code == 0) {
					layer.msg("删除成功!");
					window.location.reload();
				} else {
					layer.msg(msg.meta.message);
				}
			}
		});
	});
}
/**
 * 修改默认状态
 */
function isDefState(dataid,isDefState){
	layer.confirm("你确定要修改该默认状态吗？",function(index) {
		$.ajax({
			type : "POST",
			data : {'id':dataid,'isDef':isDefState},
			url : contextRoot+"/functional/def",
			dataType : "json",
			success : function(msg) {
				console.log(msg);
				if (msg.meta.code == 0) {
					layer.msg("修改成功!");
					window.location.reload();
				} else {
					layer.msg(msg.meta.message);
				}
			}
		});
	});
}
function edit(dateId){
	layer.open({
		type: 2,
		resize:false,
		title: "功能服务分类",
		area: ['1000px',"80%"],
		content: contextRoot+"/functional/edit_view?id=" + dateId, //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
		btn:['保存','取消'],
		yes:function(index){
			save(index);
		},
		cancel:function(){}
	});
}
/**
 * 添加推荐问题
 */
function add(){
	layer.open({
		type: 2,
		resize:false,
		title: "功能服务分类",
		area: ['1000px',"80%"],
		content: contextRoot+"/functional/edit_view", //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
		btn:['保存','取消'],
		yes:function(index){
			save(index);
		},
		cancel:function(){}
	});
}
/**
 * 保存标签
 */
function save(index){
	layer.confirm('确定要添加该服务分类吗?',function(index) {
		var obj = $("iframe").contents().find("#addForm").serialize();
		$.ajax({
			type : "POST",
			data : obj,
			url : contextRoot+"/functional/add_manager",
			dataType : "json",
			success : function(msg) {
				console.log(msg);
				if (msg.meta.code == 0) {
					layer.msg("添加成功!");
					layer.close(index);
					window.location.reload();
				} else {
					layer.msg(msg.meta.message);
				}
			}
		});
	});
}
/**
 * 更新操作
 */
function update(type,dateId){
	var msg = "你确定要";
	if(type == 0){
		msg = msg + "取消推荐吗？";
	}else if(type == 1){
		msg = msg + "添加推荐吗？";
	}else if(type == 2){
		msg = msg + "删除吗？";
	}
	layer.confirm(msg,function(index) {
		$.ajax({
			type : "POST",
			data : {"id":dateId,"type":type},
			url : contextRoot+"/functional/update_manager",
			dataType : "json",
			success : function(msg) {
				console.log(msg);
				if (msg.meta.code == 0) {
					layer.msg("操作成功!");
					layer.close(index);
					window.location.reload();
				} else {
					layer.msg(msg.meta.message);
				}
			}
		});
	});
}
</script>
<div th:include="footer::update_sort"></div>
</body>
<script type="text/javascript" th:src="@{/common.js}"></script>
</html>